@keyframes loading {

    0%,
    100% {
        transform: translate(-50%, -50%) scale(0.0);
    }

    50% {
        transform: translate(-50%, -50%) scale(1.0);
    }
}

.root {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 10000;
}

.root>div {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(1);
    width: 60px;
    height: 60px;
    opacity: .6;
    border-radius: 50%;
    background-color: var(--red);
    animation: loading 1.4s infinite ease-in;
}

.root>div:last-child {
    animation-delay: -0.7s;
}